<DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script>
    <style type="text/css">
        #ask-content{
            display: none;
        }
        #chat-room{
            border: 1px solid #f2efef;
            border-radius: 20px;
            padding: 20px;
        }
        #send-txt,#ask-name{
            padding: 20px;
            display: flex;
        }
        button{
            font-size: 12px;
            background: #0aa4d7;
            border: none;
            color: white;
            border-radius: 4px;
            padding: 3px 15px;
        }
    </style>

</head>
<body>
    <h2>临时聊天室</h2>
    <div id="ask-content">
        <div id="username">
        </div>
        <div id="chat-room" class="content">
    
        </div>
        <div id='send-txt'>
           请输入发送消息： <input id="sendTx" type="text" name="title"><br/>
            <button id="but" onclick="SubVal()">提交</button>
        </div>
    </div>
    <div id="ask-name">
        请输入你名称：<input id="sendname" type="text" name="name"><br/>
        <button id="namebut">提交</button>
    </div>
    <script>
//         var socket=io("http://152.136.216.206:8100",{transports: ['websocket'], reconnection: true});
        
    var socket=io("http://49.233.165.96:1215",{transports: ['websocket'], reconnection: true});

    socket.on('connect', function () {
        socket.emit('example', 'hi');

        socket.on('disconnect', function () {
            console.log('disconnect');
        });

        socket.on('message', function (msg) {
            console.log(msg)
        });
    });
    </script>
</body>
</html>

